<!DOCTYPE HTML>
<html lang="zh">

<head>
    <title>编辑管理员信息</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="./hui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="./hui/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="./hui/Hui-iconfont/1.0.8/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="./hui/layui/css/layui.css" />
</head>

<body>
    <div id="app">
        <article class="page-container">
            <div class="form form-horizontal" id="form-admin-add">
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-3">用户名：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" class="input-text" id="username" v-model="username">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-3">姓名：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" class="input-text" id="realname" v-model="realname">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-3">联系方式：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" class="input-text" id="contact" v-model="contact">
                    </div>
                </div>
                <div class="row cl">
                    <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                        <button class="btn btn-secondary radius" @click.prevent="update()"><i
								class="Hui-iconfont">&#xe632;</i>提交保存</button>
                        <button class="btn btn-default radius" @click.prevent="reset()">
							<i class="Hui-iconfont">&#xe68f;</i>取消重置
						</button>
                    </div>
                </div>
            </div>
        </article>
    </div>

    <script type="text/javascript" src="./hui/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript" src="./hui/js/H-ui.min.js"></script>
    <script type="text/javascript" src="./hui/js/H-ui.admin.js"></script>

    <!--此页面业务相关的脚本-->
    <script type="text/javascript" src="./hui/layui/layui.js"></script>
    <script type="text/javascript" src="./hui/js/axios.min.js"></script>
    <script type="text/javascript" src="./hui/js/vue.js"></script>
    <script type="text/javascript">
        const vue = new Vue({
            el: '#app', // 绑定作用域
            data: { //定义数据 用于vue的双向绑定
                adminid: '',
                username: '',
                password: '',
                realname: '',
                contact: '',
            },
            methods: {
                getUrlParam: function() {
                    var name, value;
                    var str = location.href; // 取得整个地址栏
                    var num = str.indexOf("?"); // 定位参数起始位置
                    str = str.substr(num + 1); // 取得所有参数 
                    var arr = str.split("&"); // 各个参数放到数组里
                    for (var i = 0; i < arr.length; i++) {
                        num = arr[i].indexOf("=");
                        if (num > 0) {
                            name = arr[i].substring(0, num);
                            value = arr[i].substr(num + 1);
                            this.adminid = value; // 确认主键参数
                        }
                    }
                },
                loadPage: function() {
                    let _this = this;
                    axios.get('http://127.0.0.1:8080/vue_wuye/admin/getAdminById.action?id=' + _this.adminid).then(result => {
                        _this.username = result.data.username;
                        _this.password = result.data.password;
                        _this.realname = result.data.realname;
                        _this.contact = result.data.contact;
                    });
                },
                reset: function() {
                    this.loadPage();
                },
                update: function() {
                    let _this = this;
                    var data = {
                        adminid: _this.adminid,
                        username: _this.username,
                        password: _this.password,
                        realname: _this.realname,
                        contact: _this.contact,
                    };
                    axios.post('http://127.0.0.1:8080/vue_wuye/admin/updateAdmin.action', data).then(result => {
                        if (result.data.code > 0) {
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.location.reload();
                            parent.layer.close(index);
                        } else {
                            alert('修改失败');
                        }
                    });
                },
            },

            created() { // 生命周期相关的函数
                this.getUrlParam();
                this.loadPage();
                let _this = this;
            },
        })
    </script>
    <!--/ 此页面业务相关的脚本-->

</body>

</html>